body, table td, select {
  font-size: medium;		/* override GWT standard */
}

#body-id {
	font-size: medium;
}

html, body {
	height: 100%;			/* required */
}

body {
	text-align: center;		/* horizontal centering hack for IE */
	padding: 0;				/* required to "hide" distance div */
	margin: 0;				/* required to "hide" distance div */
	
	background: #FFFFFF;
}

div#distance { 
	margin-bottom: -15.75em;/* half of content height */
	width: 1px;				/* required to "hide" distance div */
	height: 50%;			/* required */
	float: left;			/* required */
}

div#container {
	position: relative;   /* positions content on top of distance */
	text-align: left;     /* horizontal centering hack for IE */
	height: 31.5em;       /* desired height */
	width: 60em;          /* desired width */
	margin: 0 auto;       /* required */
	clear: left;          /* required */
}

div#leftcontainer {
	position: absolute;
	left: 0;
	top: 0;
	width: 80%;
	height: 100%;
	
}

div#rightcontainer {
	position: absolute;
	right: 0;
	top: 0;
	width: 19%;
	height: 100%;
	background-color: #5485ed;
}

div#main {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 85%;
}

div#maincontent {
	position: absolute;
	left: 10%;
	top: 10%;
	width: 80%;
	height: 90%;
	vertical-align: middle;
	text-align: center;
	background-image: url('maincontentbg.png')
}

div#mainbackgroundleft {
	position: absolute;
	left: 0;
	top: 0;
	width: 3%;
	height: 100%;
	z-index: -1;
}

div#mainbackgroundright {
	position: absolute;
	left: 97%;
	top: 0;
	width: 3%;
	height: 100%;
	z-index: -1;
}

div#mainbackgroundmiddle {
	position: absolute;
	left: 3%;
	top: 0;
	width: 95%;
	height: 100%;
	z-index: -1;
}

div#menubar {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 15%;
}

div#grass {
	width: 100%;
	height: 5%;
	text-align: center;
	position: absolute;
	left: 0;
	bottom: 15%;
	z-index: 1;
}

div#menucontent {
	width: 100%;
	height: 20%;
	text-align: center;
	position: absolute;
	left: 0;
	bottom: 5%;
	z-index: 2;
}

div#textmenu {
	width: 100%;
	height: 50%;
	text-align: center;
	z-index: 2;
}

div#buttonmenu {
	width: 100%;
	height: 50%;
	top: 50%;
	z-index: 2;
	text-align: center;
}

div#menubackground {
	width: 100%;
	height: 62%;
	background: black;
	text-align: center;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}

div#menubackgroundleft {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 5%;
	height: 40%;
	float: left;
	z-index: 1;
}

div#menubackgroundmiddle {
	position: absolute;
	left: 5%;
	bottom: 0;
	width: 91%;
	height: 40%;
	float: left;
	z-index: 1;
}

div#menubackgroundright {
	position: absolute;
	left: 95%;
	bottom: 0;
	width: 5%;
	height: 40%;
	float: left;
	z-index: 1;
}

.menubackgroundimage {
	width: 100%;
	height: 100%;
}

.background {
	_overflow:hidden;
}